<!DOCTYPE html >
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>表单</title>
    <link rel="stylesheet" th:href="@{/layui/css/layui.css}" media="all">
    <style>
        .layui-form-label{
            width: 100px;
        }
        .layui-input-block {
            margin-left: 130px;
            min-height: 36px
        }
    </style>
</head>
<body class="body">
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
    <legend>添加回复</legend>
</fieldset>

<form class="layui-form layui-from-pane" action="/add" style="margin-top:20px" method="post">
    <div class="layui-form-item">
        <label class="layui-form-label">关键词</label>
        <div class="layui-input-block">
            <input type="text" name="keyword"  required  lay-verify="required" autocomplete="off"  class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">回复</label>
        <div class="layui-input-block">
            <input type="text" name="reply"  required  lay-verify="required" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item" style="margin-top:40px">
        <div class="layui-input-block">
            <button class="layui-btn  layui-btn-submit " lay-submit="" lay-filter="demo1">立即提交</button>
        </div>
    </div>

</form>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
<script th:src="@{/layui/layui.all.js}"></script>
<input type="hidden" th:value="${serverLocation}" id="name"/>
<script>
    var serverLocation = $('#name').val();
    layui.use(['form','layer','jquery'], function(){
        var form = layui.form
            ,layer = layui.layer
            ,$=layui.jquery,
            table= layui.table
        //监听提交
        form.on('submit(demo1)', function(data){
            //layer.alert(JSON.stringify(data.field))
            //data=JSON.stringify(data.field)
            $.ajax({
                url:serverLocation+'/save',
                type:'POST',
                dataType:'json',
                contentType: "application/json",

                data:JSON.stringify(data.field),
                success:function (msg) {
                    var returnCode=msg.code;
                    if(returnCode==200){
                        layer.closeAll('loading');
                        layer.load(2);
                        layer.msg("添加成功", {icon: 6});
                        setTimeout(function(){
                            window.parent.location.reload();//修改成功后刷新父界面
                        }, 1000);
                        //加载层-风格

                    }else{
                        layer.msg("添加失败", {icon: 5});
                    }
                }
            })
            return false;
        });
    });
</script>
</body>
</html>
